@include('Home.head')
<style>

 .van-sidebar-item--select{
   color:#2B8DFF !important;
   border-color: #2B8DFF !important;
 }
 .van-sidebar-item{
 	font-size: 16px;
 }
 .van-tree-select__nav-item {
     padding: 17px 0px 17px 0px !important;
     text-align: center !important;
 }
 .img_div_zt{
  /* position: absolute; */
     z-index: 999;
     top: 0;
     width: -webkit-fill-available;
     height: auto;
     margin: 10px 10px;
     background: white;
 }
 .banner {
     height: 15rem;
     width: 100%;
     overflow: hidden;
     padding: 1.2rem;
     padding-top: 0;
     background: #f7f8fa;
 	}
 .img_zt{
 	float: left;
   width:30%;
     height: 120px;
 	border-radius: 6px;
 }
 .van-tree-select{
   width:107px;
   position: absolute;
 }
 .van-tree-select__content{
   -webkit-box-flex: 0;
     flex: 0;
 }
 .img_div{
   display: inline-block;
  /*   margin: 5px 10px; */
     text-align: left;
     width: 100%;
     height: auto;
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
 }
 .name_goods{
   font-size:20px;
 font-weight:bold;
 line-height:65px;
 color:rgba(51,51,51,1);
 opacity:1;
 }
 .am-navbar{
   opacity: 0.9  !important;
 }
 .van-search__content--round{
 	background-color: #FFF;
 	border-radius: 999px;
 }
 .van-image__img{
 	border-radius: 1rem;
 }
 	.am-header-title a{
		font-size:17px;
	}
</style>
<body>
<div class="container" id="app">
	<header data-am-widget="header" class="am-header am-header-default" style="border-bottom:#F2F2F2 2px solid;background-color: #000000;">
		<div class="am-header-left am-header-nav">
		    <a  onclick="javascript:history.back(-1);" class="">
		        <i class="am-header-icon am-icon-chevron-left"></i>
		    </a>
		</div>
	    <h1 class="am-header-title">
	        <a href="#title-link" class="" style="color: rgb(255,215,0);font-weight: 600;">营销导师</a>
	    </h1>
	</header>
	
	<div style="margin: 10px;">
		<el-input v-model="keyword"  placeholder="请输入搜索关键字">
			 <el-button slot="append" icon="am-icon-search" v-on:click="search()"></el-button>
		</el-input>
	</div>
	
	<div>
		<div class="img_div_zt" v-if="sortDatas==''" style="text-align: center;
		color: #c5c4c4;
		padding-top: 100px;">暂无商品</div>
		    <div class="img_div_zt " v-if="sortDatas!=''"  >
		      <div  class="img_div"  v-for="index,i in sortDatas" :key="i" @click="">
		        <img @click="" class="img_zt" :src="index.photo" alt="">
		        <span class="name_goods" style="margin-left: 20px;">@{{index.name}}</span><br/>
				<span style="color: #999;font-size: 12px;margin-left: 20px;">@{{index.introduction}}</span>
				<!-- <img style="width: 46px;height: 22px;margin-top: 20px;" src="http://qiniu.baoliy168.com/59c3be507165d708cea6df5aaa5221fb.png" /> -->
				<!-- <span style="color: orange;font-weight: 400;">免费</span> -->
		      </div>
		    </div>
		</div>
			
			<footer data-am-widget="navbar" class="am-navbar am-cf sxy-footer" id="" style="background-color: white;">
			    <ul class="am-navbar-nav am-cf am-avg-sm-4">
			        <li>
			            <a href="/home/excellent/index" class="footer-active">
                    <img src="http://qiniu.baoliy168.com/%E7%BB%84%203478%403x.png" alt="首页"/>
			                <span class="am-navbar-label">首页</span>
			            </a>
			        </li>
			        <li>
			            <a href="/home/agentBonus/index" class="">
                    <img src="http://qiniu.baoliy168.com/%E7%BB%84%203477%403x.png" alt="分类" />
			                <span class="am-navbar-label">分类</span>
			            </a>
			        </li>
			        <li>
			            <a href="/home/member/shopcart" class="">
                    <img src="http://qiniu.baoliy168.com/%E7%BB%84%203474%403x.png" alt="分享"/>
			                <span class="am-navbar-label">购物车</span>
			            </a>
			        </li>
			        <li>
			            <a href="/home/member/index" class="">
                    <img src="http://qiniu.baoliy168.com/%E7%BB%84%203475%403x.png" alt="我的"/>
			                <span class="am-navbar-label">我的</span>
			            </a>
			        </li>
			    </ul>
			</footer>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vant@2.4/lib/vant.min.js"></script>
<script>
    var app = new Vue({
        el: "#app",
        data: {
            db: '',
			items: [],
			sortData: {},
			active: 0,
            total: '',
			sortDatas:'',
			keyword:'',
        },
        methods: {
			search:function(){
				//获取商品数据
				
				$.post("/home/index/search_result",{'_token':'{{csrf_token()}}',class:'select',keyword:app.keyword},function (res) {
				
				    if(res.code == 1){
				        app.sortDatas = res.data
						
						if (res.data.length > 3) {
							for (var i = 0; i < 3; i++) {
								var datas = {
									goods_thumb: '',
									gid: 0
								};
								datas.goods_thumb = app.goodsList[i].goods_thumb;
								datas.gid = app.goodsList[0].id;
								app.rotation.push(datas);
							}
						}else{
							for (var i = 0; i < res.data.length; i++) {
								var datas = {
									goods_thumb: '',
									gid: 0
								};
								datas.goods_thumb = app.goodsList[i].goods_thumb;
								datas.gid = app.goodsList[0].id;
								app.rotation.push(datas);
							}
						}
				
				    } else {
				
				        layer.msg(res.data,{icon:7});
				
				    }
				
				});
				
			},
			cksp(id){
			  window.location.href = "/home/index/case_detail?id="+ id
			},
			onNavClick(index) {
			    this.active=index 
			    this.id=this.sortData[index].id
			   $.get("/home/index/get_case",{id:this.id},res=>{
			     if(res.code==1){
			       this.sortDatas=res.data
			     }else{
			       this.sortDatas=''
			     }
			     // console.log(this.sortDatas)
			   })
			   
			},
            //初始化 系统管理员列表
            initialize: function () {
				var _this = this
				$.post("/home/index/tutorIndex",{'_token':'{{csrf_token()}}',class:'select'},function (res) {
				            
				    if(res.code == 1){
						_this.sortDatas = res.data
				    } else if(res.code == 0) {
				    }   
				});
            },
            getDetails: function (id) {
                // window.location.href = "/shop/member/user/transactionDetails?type="+type+"&id="+id;
                window.location.href = "/home/agentBonus/bonusDetail?id=" + id;
            },
            obtain: function (val) {
                var query = window.location.search.substring(1);
                var vars = query.split("&");
                for (var i = 0; i < vars.length; i++) {
                    var pair = vars[i].split("=");
                    if (pair[0] == val) {
                        return pair[1];
                    }
                }
            }
        },
        //自动执行
        mounted: function () {
            this.initialize();
        },
    })
</script>
</html>
